<template>
  <div class="wrap">
    <div class="list" v-if="reports.length > 0">
      <div class="cus_item df aic jsb" v-for="(item, index) in reports" :key="index"  @click="editReports(item.id)">
        <div class="fs30 c_4c4c4c">体检日期：{{item.date_time}} <span :class="item.state === '1'? 'statusok':'statusno' "><dic-label typeCode="medical_state" v-model="item.state"></dic-label></span></div>
        <div><van-icon name="edit"></van-icon></div>
      </div>
    </div>
    <div class="nodate fs30 tc" v-if="reports.length === 0">暂无数据</div>
    <div class="addBtn tc fs30 mainBgColor" @click="editReports()">添加记录</div>
  </div>
</template>

<script>
import { getReports } from '@/api'
import dicLabel from '@/components/dic_label'
export default {
  components: {
    dicLabel
  },

  data () {
    return {
      reports: [],
      page: 1,
      totalPage: 0
    }
  },
  methods: {
    editReports (id) {
      const url = `../add_report/main?cusId=${this.$mp.query.id}&id=${id}`
      wx.navigateTo({url})
    },
    async initData () {
      const reports = await getReports(this.$mp.query.id)
      this.reports = reports.data
    },
    async getList (data, page) {
      const res = await getReports(data, page)
      if (res.data) {
        for (let i in res.data.data) {
          this.reports.push(res.data.data[i])
        }
        this.page = res.data.currentPage
        this.totalPage = res.data.totalPages
      }
    },
    async getOneList () {
      const res = await getReports(this.$mp.query.id, 1)
      if (res.data) {
        this.reports = res.data.data
        this.page = res.data.currentPage
        this.totalPage = res.data.totalPages
      }
    }
  },
  async onLoad () {
    await this.getOneList(this.$mp.query.id)
  },
  async onShow () {
    await this.getOneList(this.$mp.query.id)
  },
  async onPullDownRefresh () {
    await this.getOneList(this.$mp.query.id)
    wx.stopPullDownRefresh()
  },
  onReachBottom () {
    if (this.page < this.totalPage) {
      this.page++
      this.getList(this.$mp.query.id, this.page)
    }
  }
}
</script>

<style scoped>
.cus_item{border-bottom:1px solid #eee;padding: 20rpx;font-size: 28rpx;}
.status1{color: #2f74ff}
.status2{color: red}
.addBtn{position: fixed;bottom: 0;left: 0;width: 100%;height: 100rpx;line-height: 100rpx;color: #fff;}
.list{padding-bottom: 120rpx;}
.nodate{padding: 100rpx 0;color: #666}
.mr10{margin-right: 10rpx;}
.statusok{color:#2f74ff;margin-left: 20rpx;}
.statusno{color: red;margin-left: 20rpx;}
</style>
